<ui:composition template="/WEB-INF/template/template.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:rich="http://richfaces.org/rich"
                xmlns:a4j="http://richfaces.org/a4j"
                xmlns:fn="http://java.sun.com/jsp/jstl/functions"
                xmlns:sgbd="http://java.sun.com/jsf/composite/components">

    <ui:define name="title">Comptes</ui:define>

    <ui:define name="navigator">
        <sgbd:navigator comptes="active" />
    </ui:define>

    <ui:define name="content">
        <h:form>
            <h2>Connexion MySQL</h2>
            <h:outputText value="Base #{compteBean.current.name}" />
            <h:commandLink action="#{mySqlConnect.deconnectFromWeb()}">
                <h:graphicImage library="images" name="disconnect.gif" alt="Déconnexion" />
            </h:commandLink>
            <br /><br />
            <rich:panel header="Développeur">
                <rich:tabPanel switchType="client">
                    <rich:tab header="Sauvegarde">
                        <h3>Sauvegarde à chaud de la base de données</h3>
                        <br />
                        <h:panelGrid columns="5">
                            <h:outputText value="Chemin où sauvegarder les fichiers " />
                            <h:inputText value="#{mySqlConnect.backupHotPath}"
                                         required="true"
                                         id="backupHotPathMySql"
                                         requiredMessage="Veuillez indiquer un chemin de sauvegarde des fichiers" />
                            <rich:message for="backupHotPathMySql" ajaxRendered="true" />

                            <h:commandLink action="#{mySqlConnect.executeHotBackup()}">
                                <h:graphicImage library="images"
                                                height="16"
                                                width="16"
                                                name="Play1Pressed.png" />                            
                            </h:commandLink>
                            <h:commandLink action="#{mySqlConnect.saveBackupHotScript()}">
                                <h:graphicImage library="images"
                                                name="save.png" />
                            </h:commandLink>
                        </h:panelGrid>
                     </rich:tab>
                    <rich:tab header="Mes objets">
                        <rich:dataTable value="#{mySqlConnect.allObjectMySqlForCurrentUser}" 
                                        var="objectForCurrentUserMySql"
                                        rowClasses="even,odd"
                                        styleClass="dataTable">
                            <f:facet name="header">
                                <rich:columnGroup>
                                    <rich:column colspan="1">
                                        <h:outputText value="Objets" />
                                    </rich:column>
                                    <rich:column breakRowBefore="true">
                                        <h:outputText value="Nom" />
                                    </rich:column>
                                </rich:columnGroup>
                            </f:facet>
                            <rich:column colspan="1">
                                <rich:collapsibleSubTableToggler for="myObjectMySql" />
                                <h:outputText value="#{objectForCurrentUserMySql.type}" />
                            </rich:column>
                            <rich:collapsibleSubTable value="#{objectForCurrentUserMySql.listObject}"
                                                      var="myObjectMySql"
                                                      expanded="#{false}"
                                                      id="myObjectMySql"                                          
                                                      expandMode="client">
                                <rich:column>
                                    <h:outputText value="#{myObjectMySql}" />
                                </rich:column>
                                <f:facet name="footer">
                                    <h:outputText value="Total : #{objectForCurrentUserMySql.count}" />
                                </f:facet>
                            </rich:collapsibleSubTable>
                        </rich:dataTable>
                    </rich:tab>
                    <rich:tab header="Mes tables">
                        <h3>Mes tables, commande de mise en place et informations de stockage</h3>
                        <rich:dataTable value="#{mySqlConnect.allTableMySqlForCurrentUser}" 
                                        var="tableMySqlInfoStockage"
                                        rowClasses="even,odd"
                                        styleClass="dataTable">
                            <f:facet name="header">
                                <rich:columnGroup>                                    
                                    <rich:column>
                                        <h:outputText value="Name" />
                                    </rich:column>
                                    <rich:column>
                                        <h:outputText value="Rows" />
                                    </rich:column>
                                    <rich:column>
                                        <h:outputText value="Engine" />
                                    </rich:column>
                                    <rich:column>
                                        <h:outputText value="Average row length" />
                                    </rich:column>
                                    <rich:column>
                                        <h:outputText value="Data length (Ko)" />
                                    </rich:column>
                                    <rich:column>
                                        <h:outputText value="Max Data Length" />
                                    </rich:column>
                                    <rich:column>
                                        <h:outputText value="Index Length" />
                                    </rich:column>
                                    <rich:column breakRowBefore="true" colspan="7">
                                        <h:outputText value="Commande" />
                                    </rich:column>
                                </rich:columnGroup>
                            </f:facet>
                            <rich:column>
                                <rich:collapsibleSubTableToggler for="commandMySqlTable" />
                                <h:outputText value="#{tableMySqlInfoStockage.name}" />
                            </rich:column>
                            <rich:column>
                                <h:outputText value="#{tableMySqlInfoStockage.tableRows}" />
                            </rich:column>
                            <rich:column>
                                <h:outputText value="#{tableMySqlInfoStockage.engine}" />
                            </rich:column>
                            <rich:column>
                                <h:outputText value="#{tableMySqlInfoStockage.avgRowLength}" />
                            </rich:column>
                            <rich:column>
                                <h:outputText value="#{tableMySqlInfoStockage.dataLength}" />
                            </rich:column>
                            <rich:column>
                                <h:outputText value="#{tableMySqlInfoStockage.maxDataLength}" />
                            </rich:column>
                            <rich:column>
                                <h:outputText value="#{tableMySqlInfoStockage.indexLength}" />
                            </rich:column>
                            <rich:collapsibleSubTable value="#{tableMySqlInfoStockage.command}" 
                                                      var="commandMySqlTable"
                                                      expanded="#{false}"
                                                      id="commandMySqlTable" 
                                                      expandMode="client">
                                <rich:column colspan="6">
                                    <h:outputText value="#{commandMySqlTable}" />
                                </rich:column>
                                <rich:column colspan="1">
                                    <h:commandLink action="#{mySqlConnect.saveCommandTable()}">

                                        <f:setPropertyActionListener target="#{mySqlConnect.currentTable}" 
                                                                     value="#{tableMySqlInfoStockage}" />
                                        <h:graphicImage library="images"
                                                        name="save.png" />
                                    </h:commandLink>
                                </rich:column>
                            </rich:collapsibleSubTable>
                        </rich:dataTable>
                        <br />
                        <h3>Mes tables et index</h3>
                        <rich:dataTable value="#{mySqlConnect.allTableMySqlForCurrentUser}" 
                                        var="tableMySqlForCurrentUser"
                                        rowClasses="even,odd"
                                        styleClass="dataTable">
                            <f:facet name="header">
                                <rich:columnGroup>
                                    <rich:column colspan="3">
                                        <h:outputText value="Tables" />
                                    </rich:column>
                                    <rich:column breakRowBefore="true">
                                        <h:outputText value="Nom" />
                                    </rich:column>
                                    <rich:column>
                                        <h:outputText value="Colonne" />
                                    </rich:column>
                                    <rich:column>
                                        <h:outputText value="Type" />
                                    </rich:column>
                                </rich:columnGroup>
                            </f:facet>
                            <rich:column colspan="3">
                                <rich:collapsibleSubTableToggler for="indexByTableMySql" />
                                <h:outputText value="#{tableMySqlForCurrentUser.name}" />
                            </rich:column>
                            <rich:collapsibleSubTable value="#{tableMySqlForCurrentUser.indexes}"
                                                      var="indexByTableMySql"
                                                      expanded="#{false}"
                                                      id="indexByTableMySql"                                          
                                                      expandMode="client">
                                <rich:column>
                                    <h:outputText value="#{indexByTableMySql.name}" />
                                </rich:column>
                                <rich:column>
                                    <h:outputText value="#{indexByTableMySql.columnName}" />
                                </rich:column>
                                <rich:column>
                                    <h:outputText value="#{indexByTableMySql.type}" />
                                </rich:column>
                                <f:facet name="footer">
                                    <h:outputText value="Total : #{fn:length(tableMySqlForCurrentUser.indexes)}" />
                                </f:facet>
                            </rich:collapsibleSubTable>
                        </rich:dataTable>
                    </rich:tab>
                    <rich:tab header="Mes vues">
                        <h3>Mes vues</h3>
                        <rich:dataTable value="#{mySqlConnect.allViewMySqlForCurrentUser}"
                                        var="viewMySql"
                                        rowClasses="even,odd"
                                        styleClass="dataTable">
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Name" />
                                </f:facet>
                                <h:outputText value="#{viewMySql.name}" />
                            </rich:column>
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Command" />
                                </f:facet>
                                <h:outputText value="#{viewMySql.command}" />
                            </rich:column>
                            <rich:column>
                                <h:commandLink action="#{mySqlConnect.saveCommandView()}">
                                    <f:setPropertyActionListener target="#{mySqlConnect.currentView}" 
                                                                 value="#{viewMySql}" />
                                    <h:graphicImage library="images"
                                                    name="save.png" />
                                </h:commandLink>

                            </rich:column>
                        </rich:dataTable>
                    </rich:tab>
                    <rich:tab header="Mes méthodes">
                        <h3>Mes méthodes</h3>
                        <rich:dataTable value="#{mySqlConnect.allMethodeMySqlForCurrentUser}"
                                        var="methodeMySql"
                                        rowClasses="even,odd"
                                        styleClass="dataTable">
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Name" />
                                </f:facet>
                                <h:outputText value="#{methodeMySql.name}" />
                            </rich:column>
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Type" />
                                </f:facet>
                                <h:outputText value="#{methodeMySql.type}" />
                            </rich:column>
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Text" />
                                </f:facet>
                                <h:outputText value="#{methodeMySql.content}" />
                            </rich:column>
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Definer" />
                                </f:facet>
                                <h:outputText value="#{methodeMySql.definer}" />
                            </rich:column>
                            <rich:column>
                                <h:commandLink action="#{mySqlConnect.saveContentMethode()}">
                                    <f:setPropertyActionListener target="#{mySqlConnect.currentMethode}" 
                                                                 value="#{methodeMySql}" />
                                    <h:graphicImage library="images"
                                                    name="save.png" />
                                </h:commandLink>

                            </rich:column>
                        </rich:dataTable>
                    </rich:tab>
                    <rich:tab header="Mes déclencheurs">
                        <h3>Mes triggers</h3>
                        <rich:dataTable value="#{mySqlConnect.allTriggerMySqlForCurrentUser}"
                                        var="triggerMySql"
                                        rowClasses="even,odd"
                                        styleClass="dataTable">
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Name" />
                                </f:facet>
                                <h:outputText value="#{triggerMySql.name}" />
                            </rich:column>
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Table" />
                                </f:facet>
                                <h:outputText value="#{triggerMySql.tableName}" />
                            </rich:column>
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Command" />
                                </f:facet>
                                <h:outputText value="#{triggerMySql.command}" />
                            </rich:column>
                            <rich:column>
                                <h:commandLink action="#{mySqlConnect.saveCommandTrigger()}">
                                    <f:setPropertyActionListener target="#{mySqlConnect.currentTrigger}" 
                                                                 value="#{triggerMySql}" />
                                    <h:graphicImage library="images"
                                                    name="save.png" />
                                </h:commandLink>
                            </rich:column>
                        </rich:dataTable>
                    </rich:tab>
                    <rich:tab header="Plan d'exécution">
                        <h3>Plan d'éxecution</h3>
                        <h:panelGrid columns="2">
                            <h:inputTextarea cols="115" rows="10" value="#{mySqlConnect.myQuery}"/>
                            <a4j:commandButton action="#{mySqlConnect.createExecutionPlan()}" 
                                               value="OK"
                                               render="executionPlanMySql saveExplainPlanMySql" />
                            <a4j:outputPanel ajaxRendered="true">
                                <rich:dataTable value="#{mySqlConnect.executionPlan}"
                                                var="executionPlanMySql"
                                                rendered="#{not empty mySqlConnect.myQuery}"
                                                id="executionPlanMySql"
                                                rowClasses="even,odd">
                                    <rich:column>
                                        <f:facet name="header">
                                            <h:outputText value="Id" />
                                        </f:facet>
                                        <h:outputText value="#{executionPlanMySql.id}" />
                                    </rich:column>
                                    <rich:column>
                                        <f:facet name="header">
                                            <h:outputText value="Select type" />
                                        </f:facet>
                                        <h:outputText value="#{executionPlanMySql.selectType}" />
                                    </rich:column>
                                    <rich:column>
                                        <f:facet name="header">
                                            <h:outputText value="Table" />
                                        </f:facet>
                                        <h:outputText value="#{executionPlanMySql.table}" />
                                    </rich:column>
                                    <rich:column>
                                        <f:facet name="header">
                                            <h:outputText value="Type" />
                                        </f:facet>
                                        <h:outputText value="#{executionPlanMySql.type}" />
                                    </rich:column>
                                    <rich:column>
                                        <f:facet name="header">
                                            <h:outputText value="Possible keys" />
                                        </f:facet>
                                        <h:outputText value="#{executionPlanMySql.possibleKeys}" />
                                    </rich:column>
                                    <rich:column>
                                        <f:facet name="header">
                                            <h:outputText value="Key" />
                                        </f:facet>
                                        <h:outputText value="#{executionPlanMySql.key}" />
                                    </rich:column>
                                    <rich:column>
                                        <f:facet name="header">
                                            <h:outputText value="Key length" />
                                        </f:facet>
                                        <h:outputText value="#{executionPlanMySql.keyLength}" />
                                    </rich:column>
                                    <rich:column>
                                        <f:facet name="header">
                                            <h:outputText value="Ref" />
                                        </f:facet>
                                        <h:outputText value="#{executionPlanMySql.ref}" />
                                    </rich:column>
                                    <rich:column>
                                        <f:facet name="header">
                                            <h:outputText value="Rows" />
                                        </f:facet>
                                        <h:outputText value="#{executionPlanMySql.rows}" />
                                    </rich:column>
                                    <rich:column>
                                        <f:facet name="header">
                                            <h:outputText value="Extra" />
                                        </f:facet>
                                        <h:outputText value="#{executionPlanMySql.extra}" />
                                    </rich:column>
                                </rich:dataTable>
                            </a4j:outputPanel>
                            <a4j:outputPanel ajaxRendered="true">
                                <h:commandLink action="#{mySqlConnect.saveExecutionPlan()}"
                                               rendered="#{not empty mySqlConnect.myQuery}"
                                               id="saveExplainPlanMySql">
                                    <h:graphicImage library="images"
                                                    name="save.png" />
                                </h:commandLink>
                            </a4j:outputPanel>
                        </h:panelGrid>
                    </rich:tab>
                </rich:tabPanel>
            </rich:panel>
        </h:form>
    </ui:define>
</ui:composition>